<template>
  <div class="four_box xwzx_box" id="four_box" style="display: block">
    <div class="jiating_title">
      <h3>学生荣誉</h3>
    </div>
    <div class="g20"></div>
    <div>
      <table
        class="jtbigtable"
        width="0"
        border="0"
        cellspacing="0"
        cellpadding="0"
        v-for="item of awardList"
        :key="item.awardId"
      >
        <tbody>
          <tr>
            <td class="jtjusetd">照片</td>
            <td
              style="border-right: none;border-bottom: 1px #cdcec0 solid;text-align: center;
background-color: #fee7cd;
                        "
            >
              情况说明
            </td>
          </tr>
          <tr>
            <td class="jtjusetd" style="background-color: white">
              <div class="demo-image__preview">
                <el-image fit="contain" :src="item.awardImg" alt=""></el-image>
                <!-- :preview-src-list="familyDescription.othersImg" -->
              </div>
            </td>
            <td>
              <div>
                <div class="text item">学生编号:{{ item.recipientId }}</div>
                <div class="text item">获奖名称：{{ item.awardName }}</div>
                <div class="text item">获奖编号：{{ item.awardId }}</div>
                <div class="text item">获奖时间：{{ item.awardTime }}</div>
              </div>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</template>

<script>
export default {
  name: "StudentAwrad",
  props: {
    awardList: {
      type: Array,
      default() {
        return [];
      }
    }
  },
  data() {
    return {};
  },

  components: {},

  computed: {},

  beforeMount() {},

  mounted() {},

  methods: {},

  watch: {}
};
</script>
<style scoped lang="scss">
div {
  box-sizing: border-box;
}
.jiating_title {
  background: url("../../../../../assets/image/charity/personDonation/hopeStart/familyIntr.png")
    no-repeat;
  height: 130px;
  line-height: 130px;
  background-position: 50%;
  width: 90%;
  background-size: 100%;
  margin: 0 auto;
}
.jiating_title h3 {
  padding-top: 14px;
  padding-left: 60px;
  font-weight: bold;
}
.jtbigtable {
  width: 90%;
  line-height: 26px;
  border: 1px #cdcec0 solid;
  border-collapse: separate;
  border-spacing: 0px;
  margin: 0 auto;
}
.jtbigtable td {
  height: 40px;
}
.jtjusetd {
  background-color: #fc9f37;
  width: 20vw;
  border: 1px #fff solid;
  text-align: center;
  color: #484848;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
.biaoxian_title {
  background: url("../../../../../assets/image/charity/personDonation/hopeStart/recommender.png")
    no-repeat;
  height: 130px;
  line-height: 130px;
  background-position: 50%;
  width: 90%;
  background-size: 100%;
  margin: 0 auto;
}
.biaoxian_title h3 {
  padding-left: 60px;
  font-weight: bold;
}
</style>
